脱ハンコ！？Slack と Step Functions で実現するチャットベースの承認ワークフロー

Slack と Step Functions でチャットベースの承認ワークフロー Slack アプリを開発して、脱ハンコを目指してみませんか？

#サーバーレス

#AWS Step Functions

#AWS

下田祐士

2020.08.04

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

筆者が所属するオペレーションチームでは、弊社メンバーズサービスをご利用中のお客様へ AWS に関するお知らせのメールを送付する機会が多く、チーム内部で承認フローを利用する機会が多い状況でした。また弊社では、社内コミュニケーションツールとして Slack を利用していることもありチームメンバーからは「Slack 上で承認作業を完結できるツールが欲しい」という要望があったため、下記のブログを参考にプロトタイプを開発し、利用しています。

つい先日、Step Functions のサービス統合パターンでコールバックタスクを利用することによりプロトタイプよりもシンプルに実装できることが分かったため、サーバーレスで検証した際の PoC ソースコードを含め Slack アプリの作り方をご紹介します。なお、今回の実装にあたり参照した情報を本記事の末尾に記載いたします。

まずは、実際のサンプルイメージです。

Slack へ投稿されるボタンUI 付きのインタラクティブメッセージが、こちら

Step Functions の承認ワークフローで、承認された場合がこちら

Step Functions の承認ワークフローで、差戻された場合がこちら

では、早速 Slack の承認ワークフローアプリを作っていきましょう。

承認ワークフローアプリを作ってみた

まずはじめに、筆者の環境をご紹介します。

$ sw_vers 
ProductName:    Mac OS X
ProductVersion: 10.15.6
BuildVersion:   19G73
$ sls --version
Framework Core: 1.68.0
Plugin: 3.6.8
SDK: 2.3.0
Components: 2.30.2
$ pipenv --version
pipenv, version 2018.11.26

まずは、下記のリンクから Slack アプリを作成します。

Create your Slack app

表示されたウィンドウ内の App Name にアプリケーション名を、Development Slack Workspace に、このアプリケーションを利用する Slack のワークスペースを選択します。

必要項目を入力したら、Create App ボタンをクリックしましょう。

アプリケーションが作成されたら、Basic Information 画面が表示されます。左袖のメニューから「Incoming Webhooks」を選択し、Activate Incoming Webhooks のトグルスイッチを On にします。

画面下の方にある「Add New Webhook to Workspace」ボタンをクリックして Webhook URL を払い出しましょう。

今回は、検証用に作成した Slack アプリのため個人の DM チャンネルを指定しました。（実際にチームで利用しているツール側では、承認者のみが参加しているプライベートチャンネルを投稿先のチャンネルとして指定しています）

Webhook URL が払い出されたら、Copy ボタンをクリックして URL をクリップボードにコピーしておきます。

次に、Step Functions 等を作成していきます。利用している PC のターミナルを開いて、GitHub からソースコードを取得してください。

$ git clone https://github.com/yuji-shimoda/manual-approval.git

お使いのテキストエディターで、serverless.yml の SLACK 環境変数（18行目）に Webhook URL を追記します。あとは、serverless-python-requirements プラグインや boto3 等の必要なライブラリをインストールしデプロイするだけです。なお、本記事では、環境構築手順の紹介は割愛させていただきます。もし、環境構築作業がお済みでなければ本記事末尾のリンクから公式ドキュメント等をご参照ください。

$ sls plugin install -n serverless-python-requirements
$ sls plugin install -n serverless-step-functions
$ pipenv install boto3 requests
$ sls deploy
:
service: manual-approval
stage: dev
region: ap-northeast-1
stack: manual-approval-dev
resources: 16
api keys:
  None
endpoints:
★ POST - https://xxxxxxxxxx.execute-api.ap-northeast-1.amazonaws.com/dev/task
functions:
  worker: manual-approval-dev-worker
  receiver: manual-approval-dev-receiver
layers:
  None

API Gateway のエンドポイント（★）は、Slack アプリ側に設定するため URL をコピーしておいてください。エンドポイントをコピーしたら、ブラウザ（Slack アプリの設定画面）に戻ります。左袖メニューの「Interactivity & Shortcuts」を選択し、Interactivity のトグルスイッチを On にします。

Request URL に、API Gateway のエンドポイント（★）を設定します。

最後に、Save Changes ボタンをクリックしたら完了です。このソースコードでは、ステートマシンを起動する処理は実装されていないため、Step Functions のマネジメントコンソールからテスト起動を行います。（実際に筆者が所属するチームで利用中のプロトタイプは、Google フォームを利用して承認に必要な項目の入力フォームを提供し Google Apps Script からステートマシンを起動させています）

ステートマシンを起動すると、ApprovalRequest タスクが実行中の状態に遷移します。

ApprovalRequest タスクでは、ボタンUI 付きのインタラクティブメッセージを Slack にポストします。

ここで、「承認」ボタンをクリックすると再度確認のメッセージが促されるので「はい」ボタンをクリックします。

承認後、ボタンUI 付きのインタラクティブメッセージは下記のように Slack ユーザー名と対応したアクションで上書き（記録）されます。

Step Functions の承認ワークフロー側は、下記のように Approve を経て終了します。

なお、「差戻」ボタンをクリックした場合は「承認」時同様に再確認のメッセージが表示された後下記のように Slack ユーザー名と対応したアクションで上書き（記録）され、Step Functions の承認ワークフロー側は、Reject を経て終了します。

さいごに

この PoC コードをベースに実際の業務で必要な承認処理や、ステートマシンを起動するイベント処理等を追加実装することでプロトタイプとして利用（評価）することは出来るかと思われます。また、ワークフローを作り込むことで複数人の承認者に対して段階的に承認を依頼したり、承認ユーザーに応じた電子印を Slack にポストしたりなど工夫次第で、既存のワークフローを置き換えることも場合によっては可能かもしれません。

全てをペーパーレスにしたり商習慣をいきなりガラッと変えることは難しいと思いますが、少しづつできるところから脱ハンコを目指してみてはいかがでしょうか？　ではでは